<template>
	<div class="w1024-wrap">
		<div class="page">
			<p class="page-title">编辑集团</p>
			<div class="tab-items">
				<p class="tab-item" @click="tab(0)" v-if="form.linkmandx" :class="tabIndex==0?'selected-item':''">电信<span class="tag" v-if="form.orderstatusdx==4">未通过</span></p>
				<p class="tab-item" @click="tab(1)" v-if="form.linkmanyd" :class="tabIndex==1?'selected-item':''">移动<span class="tag" v-if="form.orderstatusyd==4">未通过</span></p>
				<p class="tab-item" @click="tab(2)" v-if="form.linkmanlt" :class="tabIndex==2?'selected-item':''">联通<span class="tag" v-if="form.orderstatuslt==4">未通过</span></p>
			</div>
			<div class="info-block">
				
				<template v-if="tabIndex==0">
					<div class="form-item">
						<p class="form-item-title">集团名称：</p>
						<div class="form-item-content">
							<el-input :disabled="!canEditdx" v-model="form.circlenamedx" placeholder="请输入集团名称"></el-input>
						</div>
					</div>
					<div class="form-item">
						<p class="form-item-title">联系人：</p>
						<div class="form-item-content">
							<el-input :disabled="!canEditdx" v-model="form.linkmandx" placeholder="请输入联系人"></el-input>
						</div>
					</div>
					<div class="form-item">
						<p class="form-item-title">联系电话：</p>
						<div class="form-item-content">
							<el-input :disabled="!canEditdx" v-model="form.linkphonedx" placeholder="请输入联系电话"></el-input>
						</div>
					</div>
					<div class="form-item">
						<p class="form-item-title">资质：</p>
						<div class="form-item-content">
							<div class="qualification-block flex flex-align-center" v-for="(block,index) in form.qualificationurldx">
								<div class="imgs clear">
									<div class="upload-item" v-if="form.qualificationstatusdx==2&&index==form.qualificationurldx.length-1" :key="index+''+index2" v-for="(item,index2) in block.qualificationurl.img">
										<image-uploader :ref="'qualificationurldx'+index2" :imageUrl="item.url" @success="(img)=>{imageUploadSuccess('qualificationurldx',index2,img)}" :fileSizeLimit="500" class="upload-wrapper" accept=".png,.jpg">
											<div class="upload-bg" v-if="!item.url"></div>
											<template v-if="item.url">
												<div class="operate-wrap flex flex-align-center flex-justify-arround">
													<img :src="change" @click="changeFile('qualificationurldx'+index2)" />
													<img :src="del" @click="delFile('qualificationurldx',index2)" />
												</div>
											</template>
										</image-uploader>
										<p slot="tip" class="upload-tip">营业执照</p>
									</div>
									<div class="img-wrap" v-if="form.qualificationstatusdx!=2||index!=form.qualificationurldx.length-1" :key="index+''+index2" v-for="(item,index2) in block.qualificationurl.img">
										<img :src="item.url" @click="viewImage(item.url)" alt="" />
										<p class="upload-tip">营业执照</p>
									</div>
								</div>
								<p class="update-time">{{block.uploadtime}}</p>
							</div>
							<p style="color: #999;" v-if="!form.qualificationurldx||!form.qualificationurldx.length">暂无资质</p>
						</div>
					</div>
				</template>
				<template v-if="tabIndex==1">
					<div class="form-item">
						<p class="form-item-title">集团名称：</p>
						<div class="form-item-content">
							<el-input :disabled="!canEdityd" v-model="form.circlenameyd" placeholder="请输入集团名称"></el-input>
						</div>
					</div>
					<div class="form-item">
						<p class="form-item-title">联系人：</p>
						<div class="form-item-content">
							<el-input :disabled="!canEdityd" v-model="form.linkmanyd" placeholder="请输入联系人"></el-input>
						</div>
					</div>
					<div class="form-item">
						<p class="form-item-title">联系电话：</p>
						<div class="form-item-content">
							<el-input :disabled="!canEdityd" v-model="form.linkphoneyd" placeholder="请输入联系电话"></el-input>
						</div>
					</div>
					<div class="form-item">
						<p class="form-item-title">资质：</p>
						<div class="form-item-content">
							<template v-if="form.qualificationurlyd">
								<div class="qualification-block flex flex-align-center" v-for="(block,index) in form.qualificationurlyd">
									<div class="imgs clear">
										<div class="upload-item" v-if="form.qualificationstatusyd==2&&index==form.qualificationurlyd.length-1" :key="index+''+index2" v-for="(item,index2) in block.qualificationurl.img">
											<image-uploader :ref="'qualificationurlyd'+index2" :imageUrl="item.url" @success="(img)=>{imageUploadSuccess('qualificationurlyd',index2,img)}" :fileSizeLimit="500" class="upload-wrapper" accept=".png,.jpg">
												<div class="upload-bg" v-if="!item.url"></div>
												<template v-if="item.url">
													<div class="operate-wrap flex flex-align-center flex-justify-arround">
														<img :src="change" @click="changeFile('qualificationurlyd'+index2)" />
														<img :src="del" @click="delFile('qualificationurlyd',index2)" />
													</div>
												</template>
											</image-uploader>
											<p slot="tip" class="upload-tip">营业执照</p>
										</div>
										<div class="img-wrap" v-if="form.qualificationstatusyd!=2||index!=form.qualificationurlyd.length-1" :key="index+''+index2" v-for="(item,index2) in block.qualificationurl.img">
											<img :src="item.url" @click="viewImage(item.url)" alt="" />
											<p class="upload-tip">营业执照</p>
										</div>
									</div>
									<p class="update-time">{{block.uploadtime}}</p>
								</div>
							</template>
							
							<p style="color: #999;" v-if="!form.qualificationurlyd||!form.qualificationurlyd.length">暂无资质</p>
						</div>
					</div>
				</template>
				<template v-if="tabIndex==2">
					<div class="form-item">
						<p class="form-item-title">集团名称：</p>
						<div class="form-item-content">
							<el-input :disabled="!canEditlt" v-model="form.circlenamelt" placeholder="请输入集团名称"></el-input>
						</div>
					</div>
					<div class="form-item">
						<p class="form-item-title">联系人：</p>
						<div class="form-item-content">
							<el-input :disabled="!canEditlt" v-model="form.linkmanlt" placeholder="请输入联系人"></el-input>
						</div>
					</div>
					<div class="form-item">
						<p class="form-item-title">联系电话：</p>
						<div class="form-item-content">
							<el-input :disabled="!canEditlt" v-model="form.linkphonelt" placeholder="请输入联系电话"></el-input>
						</div>
					</div>
					<div class="form-item">
						<p class="form-item-title">资质：</p>
						<div class="form-item-content">
							<template v-if="form.qualificationurllt">
								<div class="qualification-block flex flex-align-center" v-for="(block,index) in form.qualificationurllt">
									<div class="imgs clear">
										<template v-if="block.qualificationurl">
											<div class="upload-item" v-if="form.qualificationstatuslt==2&&index==form.qualificationurllt.length-1" :key="index+''+index2" v-for="(item,index2) in block.qualificationurl.img">
												<image-uploader :ref="'qualificationurllt'+index2" :imageUrl="item.url" @success="(img)=>{imageUploadSuccess('qualificationurllt',index2,img)}" :fileSizeLimit="500" class="upload-wrapper" accept=".png,.jpg">
													<div class="upload-bg" v-if="!item.url"></div>
													<template v-if="item.url">
														<div class="operate-wrap flex flex-align-center flex-justify-arround">
															<img :src="change" @click="changeFile('qualificationurllt'+index2)" />
															<img :src="del" @click="delFile('qualificationurllt',index2)" />
														</div>
													</template>
												</image-uploader>
												<p slot="tip" class="upload-tip">营业执照</p>
											</div>
											<div class="img-wrap" v-if="form.qualificationstatuslt!=2||index!=form.qualificationurllt.length-1" :key="index+''+index2" v-for="(item,index2) in block.qualificationurl.img">
												<img :src="item.url" @click="viewImage(item.url)" alt="" />
												<p class="upload-tip">营业执照</p>
											</div>
										</template>
										<template v-if="block.acceptmaterial">
											<div class="upload-item" v-if="form.qualificationstatuslt==2&&index==form.qualificationurllt.length-1" :key="index+'1'+index2" v-for="(item,index2) in block.acceptmaterial.img">
												<image-uploader :ref="'acceptmaterial'+index2" :imageUrl="item.url" @success="(img)=>{imageUploadSuccess('acceptmaterial',index2,img)}" :fileSizeLimit="500" class="upload-wrapper" accept=".png,.jpg">
													<div class="upload-bg" v-if="!item.url"></div>
													<template v-if="item.url">
														<div class="operate-wrap flex flex-align-center flex-justify-arround">
															<img :src="change" @click="changeFile('acceptmaterial'+index2)" />
															<img :src="del" @click="delFile('acceptmaterial',index2)" />
														</div>
													</template>
												</image-uploader>
												<p slot="tip" class="upload-tip">受理单</p>
											</div>
											<div class="img-wrap" v-if="form.qualificationstatuslt!=2||index!=form.qualificationurllt.length-1" :key="index+'1'+index2" v-for="(item,index2) in block.acceptmaterial.img">
												<img :src="item.url" @click="viewImage(item.url)" alt="" />
												<p class="upload-tip">受理单</p>
											</div>
										</template>
									</div>
									<p class="update-time">{{block.uploadtime}}</p>
								</div>
							</template>
							
							<p style="color: #999;" v-if="!form.qualificationurllt||!form.qualificationurllt.length">暂无资质</p>
							<!--<div class="clear">
								<div class="upload-item" v-if="form.qualificationstatuslt==2" :key="index" v-for="(item,index) in form.qualificationurllt.img" >
									<image-uploader :ref="'qualificationurllt'+index" :imageUrl="item.url" @success="(img)=>{imageUploadSuccess('qualificationurllt',index,img)}" :fileSizeLimit="500" class="upload-wrapper" accept=".png,.jpg">
										<div class="upload-bg" v-if="!item.url"></div>
										<template v-if="item.url">
											<div class="operate-wrap flex flex-align-center flex-justify-arround">
												<img :src="change" @click="changeFile('qualificationurllt'+index)" />
												<img :src="del" @click="delFile('qualificationurllt',index)" />
											</div>
										</template>
									</image-uploader>
									<p slot="tip" class="upload-tip">营业执照</p>
								</div>
								<div class="upload-item" v-if="form.qualificationstatuslt==2"  v-for="(item,index) in form.acceptmaterial.img">
									<image-uploader :key="'acceptmaterial'+index" :ref="'acceptmaterial'+index" :imageUrl="item.url" @success="(img)=>{imageUploadSuccess('acceptmaterial',index,img)}" :fileSizeLimit="500" class="upload-wrapper" accept=".png,.jpg">
										<div class="upload-bg" v-if="!item.url"></div>
										
										<template v-if="item.url">
											<div class="operate-wrap flex flex-align-center flex-justify-arround">
												<img :src="change" @click="changeFile('acceptmaterial'+index)" />
												<img :src="del" @click="delFile('acceptmaterial',index)" />
											</div>
										</template>
									</image-uploader>
									<p slot="tip" class="upload-tip">受理单</p>
								</div>
								<div class="img-wrap" v-if="form.qualificationstatuslt!=2&&item.url" :key="'qualificationurllt'+index" v-for="(item,index) in form.qualificationurllt.img">
									<img :src="item.url" alt="" />
									<p class="upload-tip">营业执照</p>
								</div>
								<div class="img-wrap" v-if="form.qualificationstatuslt!=2&&form.acceptmaterial.img.length" :key="'acceptmaterial'+index" v-for="(item,index) in form.acceptmaterial.img">
									<img :src="item.url" alt="" />
									<p class="upload-tip">受理单</p>
								</div>
								<p style="color: #999;" v-if="form.qualificationstatuslt!=2&&!form.qualificationurllt.img[0].url&&!form.acceptmaterial.img.length">暂无资质</p>
							</div>-->
						</div>
					</div>
				</template>
				<div class="form-item">
					<p class="form-item-title">状态：</p>
					<div class="form-item-content">
						<div class="info-para">{{form['orderstatus'+yysList[tabIndex]]===1?'待支付':form['orderstatus'+yysList[tabIndex]]==2?'待审核':form['orderstatus'+yysList[tabIndex]]==3?'审核通过':'审核不通过'}}</div>
					</div>
				</div>
				<div class="form-item" v-if="form['auditmemo'+yysList[tabIndex]]">
					<p class="form-item-title">备注：</p>
					<div class="form-item-content">
						<p>{{form['auditmemo'+yysList[tabIndex]]}}</p>
					</div>
				</div>
			</div>
			<div class="btn-wrap flex flex-justify-center">
				<el-button size="medium" type="primary" plain @click="back">返回</el-button>
				<el-button size="medium" type="primary" v-if="form['qualificationstatus'+yysList[tabIndex]]==2" @click="submit">提交</el-button>
			</div>
		</div>
		<view-img :src="imgSrc" v-if="showImg" @close="closeImg"></view-img>
	</div>
</template>

<script>
	import { phoneReg,deepClone} from "@/utils/common"
	import ImageUploader from '@/components/ImageUploader'
	import change from '@/assets/images/change.png'
	import del from '@/assets/images/del.png'
	export default {
		name: 'GroupDetail',
		components: {
			ImageUploader,
		},
		data() {
			return {
				change,
				del,
				
				tabIndex: 0,
				id: this.$route.params.id,
				canEditdx:false,
				canEdityd:false,
				canEditlt:false,
				form: {
					circlenamedx:'',
					linkmandx:'',
					linkphonedx:'',
					circlenameyd:'',
					linkmanyd:'',
					linkphoneyd:'',
					circlenamelt:'',
					linkmanlt:'',
					linkphonelt:'',
//					qualificationurldx: {
//						img: [{
//							url: ''
//						}]
//					},
//					qualificationurlyd: {
//						img: [{
//							url: ''
//						}]
//					},
//					qualificationurllt: {
//						img: [{
//							url: ''
//						}]
//					},
//					acceptmaterial:{
//						img: [{
//							url: ''
//						}]
//					},
				},
				_form:{},
				dxImgs:'',
				ydImgs:'',
				ltImgs:'',
				acceptmaterialImgs:'',
				yysList:['dx','yd','lt'],
			}
		},

		mounted() {
			this.getGroupDetail()
		},
		methods: {
			getGroupDetail() {
				this.$request.queryGroupDetail2({
						circlecommonuid: this.id,
					})
					.then(res => {
						if(res.code == 0) {
							this.data = res
							Object.assign(this.form, res)
							console.log(this.form)
							if(!this.form.linkmandx){
								this.tabIndex =1
							}
							if(!this.form.linkmandx&&!this.form.linkmanyd){
								this.tabIndex =2
							}
							this.canEditdx=this.form.orderstatusdx==4
							this.canEdityd=this.form.orderstatusyd==4
							this.canEditlt=this.form.orderstatuslt==4
							var dxImgs=[],ydImgs=[],ltImgs=[],acceptmaterialImgs=[]
							if(this.form.qualificationurldx&&this.form.qualificationurldx.length){
								for(var i=0;i<this.form.qualificationurldx[this.form.qualificationurldx.length-1].qualificationurl.img.length;i++){
									var obj=this.form.qualificationurldx[this.form.qualificationurldx.length-1].qualificationurl.img[i]
									if(obj.url){
										dxImgs.push(obj.url)
									}
								}
							}
							if(this.form.qualificationstatusdx==2&&!this.form.qualificationurldx.length){
								this.form.qualificationurldx=[{qualificationurl:{img:[{url:''}]}}]
							}
							if(this.form.qualificationurlyd&&this.form.qualificationurlyd.length){
								for(var i=0;i<this.form.qualificationurlyd[this.form.qualificationurlyd.length-1].qualificationurl.img.length;i++){
									var obj=this.form.qualificationurlyd[this.form.qualificationurlyd.length-1].qualificationurl.img[i]
									if(obj.url){
										ydImgs.push(obj.url)
									}
								}
							}
							if(this.form.qualificationstatusyd==2&&!this.form.qualificationurlyd.length){
								this.form.qualificationurlyd=[{qualificationurl:{img:[{url:''}]}}]
							}
							if(this.form.qualificationurllt&&this.form.qualificationurllt.length){
								if(this.form.qualificationurllt[this.form.qualificationurllt.length-1].qualificationurl){
									for(var i=0;i<this.form.qualificationurllt[this.form.qualificationurllt.length-1].qualificationurl.img.length;i++){
										var obj=this.form.qualificationurllt[this.form.qualificationurllt.length-1].qualificationurl.img[i]
										if(obj.url){
											ltImgs.push(obj.url)
										}
									}
								}else{
									this.form.qualificationurllt[this.form.qualificationurllt.length-1].qualificationurl={img:[{url:''}]}
								}
								for(var i=0;i<this.form.qualificationurllt[this.form.qualificationurllt.length-1].acceptmaterial.img.length;i++){
									var obj=this.form.qualificationurllt[this.form.qualificationurllt.length-1].acceptmaterial.img[i]
									if(obj.url){
										acceptmaterialImgs.push(obj.url)
									}
									if(i==this.form.qualificationurllt[this.form.qualificationurllt.length-1].acceptmaterial.img.length-1&&obj.url&&this.form.qualificationstatuslt==2){
										this.form.qualificationurllt[this.form.qualificationurllt.length-1].acceptmaterial.img.push({url:''})
										break;
									}
								}
							}
							console.log(this.form)
							this.dxImgs=dxImgs.join(',')
							this.ydImgs=ydImgs.join(',')
							this.ltImgs=ltImgs.join(',')
							this.acceptmaterialImgs=acceptmaterialImgs.join(',')
						} else {

						}
					})
			},
			tab(index) {
				this.tabIndex = index
			},
			imageUploadSuccess(prop,index, img) {
				if(img.code == 0) {
					if(prop!='acceptmaterial'){
						this.form[prop][this.form[prop].length-1].qualificationurl.img[index].url = img.uploadpath
					}else{
						this.form.qualificationurllt[this.form.qualificationurllt.length-1].acceptmaterial.img[index].url=img.uploadpath
						this.form.qualificationurllt[this.form.qualificationurllt.length-1].acceptmaterial.img.push({
							url: ''
						})
					}
					this.$forceUpdate()
				}
			},
			changeFile(prop) {
				this.$refs[prop][0].selectFile()
			},
			delFile(prop,index) {
				if(prop!='acceptmaterial'){
					this.form[prop][this.form[prop].length-1].qualificationurl.img[index].url=''
					if(this.form[prop][this.form[prop].length-1].qualificationurl.img.length>1){
						this.form[prop][this.form[prop].length-1].qualificationurl.img.splice(index, 1)
					}
				}else{
					this.form.qualificationurllt[this.form.qualificationurllt.length-1].acceptmaterial.img[index].url=''
				}
				this.$forceUpdate()
			},
			submit() {
				if(this.network) {
					return
				}
				var formData={
					circlecommonuid:this.id,
					circlenamedx:this.form.circlenamedx,
					linkmandx:this.form.linkmandx,
					linkphonedx:this.form.linkphonedx,
					circlenameyd:this.form.circlenameyd,
					linkmanyd:this.form.linkmanyd,
					linkphoneyd:this.form.linkphoneyd,
					circlenamelt:this.form.circlenamelt,
					linkmanlt:this.form.linkmanlt,
					linkphonelt:this.form.linkphonelt,
				}
				if(this.tabIndex==0){
					if(!this.form.circlenamedx) {
						this.msgError('请输入集团名称')
						return
					}
					if(!this.form.linkmandx) {
						this.msgError('请输入联系人')
						return
					}
					if(!this.form.linkphonedx) {
						this.msgError('请输入联系电话')
						return
					}
					if(!phoneReg.test(this.form.linkphonedx)) {
						this.msgError('联系电话格式错误')
						return
					}
					
				}
				if(this.tabIndex==1){
					if(!this.form.circlenameyd) {
						this.msgError('请输入集团名称')
						return
					}
					if(!this.form.linkmanyd) {
						this.msgError('请输入联系人')
						return
					}
					if(!this.form.linkphoneyd) {
						this.msgError('请输入联系电话')
						return
					}
					if(!phoneReg.test(this.form.linkphoneyd)) {
						this.msgError('联系电话格式错误')
						return
					}
					
				}
				if(this.tabIndex==2){
					if(!this.form.circlenamelt) {
						this.msgError('请输入集团名称')
						return
					}
					if(!this.form.linkmanlt) {
						this.msgError('请输入联系人')
						return
					}
					if(!this.form.linkphonelt) {
						this.msgError('请输入联系电话')
						return
					}
					if(!phoneReg.test(this.form.linkphonelt)) {
						this.msgError('联系电话格式错误')
						return
					}
					
				}
				if(this.form.qualificationstatusdx!=undefined){
					var imgs=[]
					if(this.form.qualificationurldx&&this.form.qualificationurldx.length){
						for(var i=0;i<this.form.qualificationurldx[this.form.qualificationurldx.length-1].qualificationurl.img.length;i++){
							var obj=this.form.qualificationurldx[this.form.qualificationurldx.length-1].qualificationurl.img[i]
							if(obj.url){
								imgs.push(obj.url)
							}
						}
					}
//					if(this.form.qualificationstatusdx==2&&this.dxImgs&&this.dxImgs==imgs.join(',')){
//						this.msgError('请重新上传电信资质')
//						return
//					}
					formData.qualificationurldx=imgs.join(',')
				}
				if(this.form.qualificationstatusyd!=undefined){
					var imgs=[]
					if(this.form.qualificationurlyd&&this.form.qualificationurlyd.length){
						for(var i=0;i<this.form.qualificationurlyd[this.form.qualificationurlyd.length-1].qualificationurl.img.length;i++){
							var obj=this.form.qualificationurlyd[this.form.qualificationurlyd.length-1].qualificationurl.img[i]
							if(obj.url){
								imgs.push(obj.url)
							}
						}
					}
//					if(this.form.qualificationstatusyd==2&&this.ydImgs&&this.ydImgs==imgs.join(',')){
//						this.msgError('请重新上传移动资质')
//						return
//					}
					formData.qualificationurlyd=imgs.join(',')
				}
				if(this.form.qualificationstatuslt!=undefined){
					var imgs=[],imgs2=[]
					if(this.form.qualificationurllt&&this.form.qualificationurllt.length){
						if(this.form.qualificationurllt[this.form.qualificationurllt.length-1].qualificationurl){
							for(var i=0;i<this.form.qualificationurllt[this.form.qualificationurllt.length-1].qualificationurl.img.length;i++){
								var obj=this.form.qualificationurllt[this.form.qualificationurllt.length-1].qualificationurl.img[i]
								if(obj.url){
									imgs.push(obj.url)
								}
							}
						}
						for(var i=0;i<this.form.qualificationurllt[this.form.qualificationurllt.length-1].acceptmaterial.img.length;i++){
							var obj=this.form.qualificationurllt[this.form.qualificationurllt.length-1].acceptmaterial.img[i]
							if(obj.url){
								imgs2.push(obj.url)
							}
						}
					}
					
					if(!imgs2.length){
						this.msgError('请上传联通受理单')
						return
					}
//					if(this.form.qualificationstatuslt==2&&this.acceptmaterialImgs==imgs2.join(',')){
//						this.msgError('请重新上传联通资质')
//						return
//					}
					formData.qualificationurllt=imgs.join(',')
					formData.acceptmaterial=imgs2.join(',')
				}
				this.network=true
				console.log(formData)
				this.$request.updateGroup(formData)
				.then(res=>{
					if(res.code==0){
						this.msgSuccess('编辑成功')
						setTimeout(()=>{
							this.back()
						},1500)
						this.getGroupDetail()
					}else{
						this.msgError(res.msg)
					}
					this.network=false
				})
			},
		}
	}
</script>

<style scoped lang="scss">
	.w1024-wrap {
		.page {
			padding-left: 20px;
			padding-right: 20px;
		}
		.page-title {
			height: 78px;
			line-height: 78px;
			color: #333;
			font-size: 18px;
			padding-left: 10px;
			font-weight: bold;
		}
		.tab-items {
			height: 40px;
			.tab-item {
				width: 100px;
				height: 40px;
				line-height: 38px;
				text-align: center;
				color: #333;
				font-size: 16px;
				cursor: pointer;
				margin-right: 20px;
				float: left;
				position:relative;
				.tag{
					font-size: 12px;
					position: absolute;
					top: 0;
					right: -12px;
					height: 18px;
					line-height: 18px;
					background: #FF0000;
					border-radius: 10px;
					color: #fff;
					padding: 0 4px;
				}
			}
			.selected-item {
				color: #0088EA;
				border-bottom: 2px solid #0088EA;
			}
		}
		.info-block {
			border-top: 1px solid #f5f5f5;
			padding-top: 16px;
			.form-item {
				display: block;
				margin-bottom: 24px;
				position: relative;
				.form-item-title {
					font-size: 16px;
					width: 120px;
					position: absolute;
					left: 0;
					top: 0;
				}
				.form-item-content {
					font-size: 16px;
					padding-left: 120px;
					float: none;
					width: auto;
					.qualification-block{
						width: 800px;
						border: 1px dashed #ddd;
						padding: 8px;
						margin-bottom: 20px;
						&:last-child{
							margin-bottom: 0;
						}
						.imgs{
							width: 600px;
						}
						.update-time{
							color: #666;
							font-size: 14px;
						}
					}
					.img-wrap{
					    width: 100px;
					    margin-right: 20px;
					    float: left;
					    /*background: #f5f5f5;*/
					    position: relative;
					    img{
					    	width: 100%;
					    	height: 100px;
					    	display: block;
					    }
					}
					.info-para {
						font-size: 16px;
					}
					.el-input {
						width: 310px;
					}
				}
			}
		}
		.btn-wrap {
			padding: 40px 0;
			border-top: 1px solid #f5f5f5;
			.el-button {
				font-size: 16px;
				border-radius: 0;
				margin: 0 40px;
			}
		}
	}
	.upload-item{
		width: 100px;
		margin-right: 20px;
		float: left;
		.upload-wrapper {
			width: 100px;
			height: 100px;
			background: #f5f5f5;
			position: relative;
			>img {
				width: 100%;
				height: 100%;
			}
			.upload-bg {
				width: 100%;
				height: 100%;
				background: url(../../../assets/images/upload-bg.png);
			}
			
			&:hover {
				.operate-wrap {
					display: flex;
				}
			}
			.operate-wrap {
				position: absolute;
				width: 100%;
				height: 24px;
				left: 0;
				bottom: 0;
				background: rgba(255, 0, 0, 0.8);
				opacity: 0.8;
				display: none;
				padding: 0 10px;
			}
			.operate-wrap .operate {
				width: 20px;
				height: 20px;
				cursor: pointer;
			}
		}
		
	}
	.upload-tip{
		text-align: center;
		color: #999;
	}
</style>